<template>
  <div class="page">
    <!-- <div>尝试不依赖其他什么鬼的办法把ruffle和vue整合起来</div> -->
    <div class="game" ref="game"></div>
  </div>
</template>
<script>
export default {
  mounted() {
    window.RufflePlayer = window.RufflePlayer || {};
    window.RufflePlayer.config = {
      // Options affecting the whole page
      publicPath: "/static/ruffle/",
      polyfills: true

      // Options affecting files only
      // autoplay: "auto",
      // unmuteOverlay: "visible",
      // backgroundColor: null,
      // letterbox: "fullscreen",
      // warnOnUnsupportedContent: true,
      // contextMenu: true,
      // showSwfDownload: false,
      // upgradeToHttps: window.location.protocol === "https:",
      // maxExecutionDuration: { secs: 15, nanos: 0 },
      // logLevel: "error",
      // base: null,
      // menu: true,
      // salign: "",
      // scale: "showAll",
      // quality: "high"
    };
    let ruffle = window.RufflePlayer.newest();
    let player = ruffle.createPlayer();
    player.style.width = "100%";
    player.style.height = "100%";
    // let container = document.getElementById("game");
    let container = this.$refs.game;
    container.appendChild(player);
    player.load("/static/swf/plazma_burst_1.swf").then(() => {
      this.$notify.success({
        title: "Luigi",
        message: "SWF文件加载成功"
      });
    });
  }
};
</script>
<style lang="less">
.page {
  background-color: #eee;
  height: 100%;
  .game {
    width: 100%;
    height: 100%;
  }
}
</style>
